<template>
  <div>
    <el-row>
      <el-col :span="24">
        <el-form :inline="true">
          <el-form-item>
            <el-button type="primary" @click="showAddCarBrandWindow">新增汽车品牌</el-button>
            <el-button type="primary" @click="banCarBrand">禁用选中</el-button>
            <el-button type="primary" @click="unlockCarBrand">解禁选中</el-button>
            <el-button type="primary" @click="deleteCarBrand">删除选中</el-button>
            <el-button type="primary" @click="showAllYearWindow">年份</el-button>
            <el-button type="primary" @click="showAllDisplacementWindow">排量</el-button>
            <el-button type="primary" @click="showCarHotWindow">汽车热度榜</el-button>
          </el-form-item>
        </el-form>
      </el-col>
    </el-row>

    <el-row style="margin-top: 20px;">
      <el-col :span="24">
        <el-table :data="carBrandList" style="width: 100%" @selection-change="handleSelectionChange">
          <el-table-column type="selection" width="55">
          </el-table-column>
          <el-table-column label="品牌logo" width="180" align="center">
            <template slot-scope="scope">
              <el-avatar :src="scope.row.brandImage" :size="120" fit="cover"></el-avatar>
            </template>
          </el-table-column>
          <el-table-column prop="brandName" label="品牌名称" width="180" align="center"></el-table-column>
          <el-table-column label="状态" width="180" align="center" label-align="center">
            <template slot-scope="scope">{{ getStateText(scope.row.brandState)}}</template>
          </el-table-column>
          <el-table-column label="操作" width="300" align="center">
            <template slot-scope="scope">
              <el-button type="text" v-if="scope.row.brandState==0" @click="banCarBrandById(scope.row)">禁用</el-button>
              <el-button type="text" v-if="scope.row.brandState==1"
                @click="unlockCarBrandByid(scope.row)">解禁</el-button>
              <el-button type="text" @click="deleteCarBrandById(scope.row)">删除</el-button>
              <el-button type="text" @click="showUpdateCarBrandImageWindow(scope.row)">修改图片</el-button>
              <el-button type="text" @click="showCarSeriesWindow(scope.row)">系列</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-col>
    </el-row>


    <!--新增汽车品牌窗口-->
    <el-dialog title="新增汽车品牌" :visible.sync="addCarBrandWindow">
      <el-form :model="addCarBrand" label-width="150px">
        <el-row :gutter="20" type="flex">
          <el-col :span="12">
            <el-form-item label="品牌名:">
              <el-input v-model="addCarBrand.brandName" placeholder="请输入品牌名"></el-input>
            </el-form-item>
            <el-form-item label="品牌logo:">
              <el-upload :headers="headers" name="brandImage" :data="addCarBrand" class="upload-demo" ref="upload"
                action="http://192.168.60.79:80/car/carBrand/insertCarBrand" :auto-upload="false"
                :on-success="addCarBrandSuccess" :on-error="addCarBrandError">
                <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
                <el-button style="margin-left: 10px;" size="small" type="success"
                  @click="insertCarBrand">新增汽车品牌</el-button>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="addCarBrandWindow = false">取 消</el-button>
      </div>
    </el-dialog>
    <!--修改图片窗口-->
    <el-dialog title="修改汽车品牌logo" :visible.sync="updateCarBrandImageWindow">
      <el-form :model="updateCarBrandImageForm" label-width="150px">
        <el-row :gutter="20" type="flex">
          <el-col :span="12">
            <el-form-item label="品牌logo:">
              <el-upload :headers="headers" name="brandImage" :data="updateCarBrandImageForm" class="upload-demo"
                ref="upload" action="http://192.168.60.79:80/car/carBrand/updateCarBrandImage" :auto-upload="false"
                :on-success="updateCarBrandImageSuccess" :on-error="updateCarBrandImageError">
                <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
                <el-button style="margin-left: 10px;" size="small" type="success"
                  @click="updateCarBrandImage">修改汽车品牌logo</el-button>
              </el-upload>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="updateCarBrandImageWindow = false">取 消</el-button>
      </div>
    </el-dialog>

    <!--汽车系列窗口-->
    <el-dialog title="汽车系列" :visible.sync="carSeriesWindow">
      <el-row>
        <el-col :span="24">
          <el-form :inline="true">
            <el-form-item>
              <el-button type="primary" @click="showAddCarSeriesWindow">新增汽车系列</el-button>
              <el-button type="primary" @click="banCarSeries">禁用选中</el-button>
              <el-button type="primary" @click="unlockCarSeries">解禁选中</el-button>
              <el-button type="primary" @click="deleteCarSeries">删除选中</el-button>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>

      <el-table :data="carSeriesList" style="width: 100%" @selection-change="handleCarSeriesChange">
        <el-table-column type="selection" width="55">
        </el-table-column>
        <el-table-column prop="seriesName" label="系列名称" width="180" align="center"></el-table-column>
        <el-table-column label="状态" width="180" align="center" label-align="center">
          <template slot-scope="scope">{{ getStateText(scope.row.seriesState)}}</template>
        </el-table-column>
        <el-table-column label="操作" width="300" align="center">
          <template slot-scope="scope">
            <el-button type="text" v-if="scope.row.seriesState==0" @click="banCarSeriesById(scope.row)">禁用</el-button>
            <el-button type="text" v-if="scope.row.seriesState==1"
              @click="unlockCarSeriesByid(scope.row)">解禁</el-button>
            <el-button type="text" @click="deleteCarSeriesById(scope.row)">删除</el-button>
            <el-button type="text" @click="showCarStyleWindow(scope.row)">款式</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>

    <!--新增汽车系列窗口-->
    <el-dialog title="新增汽车系列" :visible.sync="addCarSeriesWindow">
      <el-form :model="addCarSeries" label-width="150px">
        <el-row :gutter="20" type="flex">
          <el-col :span="12">
            <el-form-item label="系列名:">
              <el-input v-model="addCarSeries.seriesName" placeholder="请输入系列名"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="addCarSeriesWindow = false">取 消</el-button>
        <el-button @click="insertCarSeries">新 增</el-button>
      </div>
    </el-dialog>
    <!--年份窗口-->
    <el-dialog title="年份" :visible.sync="allYearWindow">
      <el-row>
        <el-col :span="24">
          <el-form :inline="true">
            <el-form-item label="生产年份:">
              <el-input v-model="cSYear" placeholder="请输入生产年份"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="insertYear">新增年份</el-button>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>

      <el-table :data="yearList" style="width: 100%">
        <el-table-column prop="csid" label="生产年份编号" width="180" align="center"></el-table-column>
        <el-table-column prop="csyear" label="生产年份" width="180" align="center"></el-table-column>
      </el-table>
    </el-dialog>

    <!--汽车款式窗口-->
    <el-dialog title="汽车款式" :visible.sync="carStyleWindow">
      <el-row>
        <el-col :span="24">
          <el-form :inline="true">
            <el-form-item>
              <el-button type="primary" @click="showAddCarStyleWindow()">新增汽车款式</el-button>
              <el-button type="primary" @click="banCarStyle">禁用选中</el-button>
              <el-button type="primary" @click="unlockCarStyle">解禁选中</el-button>
              <el-button type="primary" @click="deleteCarStyle">删除选中</el-button>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>

      <el-table :data="carStyleList" style="width: 100%" @selection-change="handleCarStyleChange">
        <el-table-column type="selection" width="55">
        </el-table-column>
        <el-table-column prop="styleName" label="款式名称" width="100" align="center"></el-table-column>
        <el-table-column prop="styleDetails" label="款式描述" width="100" align="center"></el-table-column>
        <el-table-column prop="carPrice" label="车辆参考价" width="100" align="center"></el-table-column>
        <el-table-column label="状态" width="100" align="center" label-align="center">
          <template slot-scope="scope">{{ getStateText(scope.row.styleState)}}</template>
        </el-table-column>
        <el-table-column label="操作" width="300" align="center">
          <template slot-scope="scope">
            <el-button type="text" v-if="scope.row.styleState==0" @click="banCarStyleById(scope.row)">禁用</el-button>
            <el-button type="text" v-if="scope.row.styleState==1" @click="unlockCarStyleByid(scope.row)">解禁</el-button>
            <el-button type="text" @click="deleteCarStyleById(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>

    <!--新增汽车款式窗口-->
    <el-dialog title="新增汽车款式" :visible.sync="addCarStyleWindow">
      <el-form :model="addCarStyleForm" label-width="150px">
        <el-row :gutter="20" type="flex">
          <el-col :span="12">
            <el-form-item label="系列名:">
              <el-input v-model="addCarStyleForm.styleName" placeholder="请输入系列名"></el-input>
            </el-form-item>
            <el-form-item label="请选择车系生产年份:">
              <el-select v-model="addCarStyleForm.csid" placeholder="生产年份" clearable>
                <el-option v-for="item in yearList" :key="item.csid" :label="item.csyear"
                  :value="item.csid"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="款式描述:">
              <el-input v-model="addCarStyleForm.styleDetails" placeholder="请输入款式描述"></el-input>
            </el-form-item>
            <el-form-item label="车辆参考价:">
              <el-input-number :step="0.01" v-model="addCarStyleForm.carPrice" placeholder="请输入车辆参考价"
                :controls="false"></el-input-number>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="addCarStyleWindow = false">取 消</el-button>
        <el-button @click="insertCarStyle">新 增</el-button>
      </div>
    </el-dialog>

    <!--汽车热度榜窗口-->
    <el-dialog title="汽车热度榜" :visible.sync="carHotWindow">
      <el-row>
        <el-col :span="24">
          <el-form :inline="true">
            <el-form-item>
              <el-button type="primary" @click="showAddCarHotWindow">新增汽车热度榜</el-button>
              <el-button type="primary" @click="banCarHot">禁用选中</el-button>
              <el-button type="primary" @click="unlockCarHot">解禁选中</el-button>
              <el-button type="primary" @click="deleteCarHot">删除选中</el-button>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>

      <el-table :data="carHotList" style="width: 100%" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55">
        </el-table-column>
        <el-table-column prop="brandName" label="品牌名" width="100" align="center"></el-table-column>
        <el-table-column prop="hotNum" label="热度值" width="100" align="center"></el-table-column>
        <el-table-column label="状态" width="100" align="center" label-align="center">
          <template slot-scope="scope">{{ getStateText(scope.row.hotState)}}</template>
        </el-table-column>
        <el-table-column label="操作" width="300" align="center">
          <template slot-scope="scope">
            <el-button type="text" v-if="scope.row.hotState==0" @click="banCarHotById(scope.row)">禁用</el-button>
            <el-button type="text" v-if="scope.row.hotState==1" @click="unlockCarHotByid(scope.row)">解禁</el-button>
            <el-button type="text" @click="deleteCarHotById(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>

    <!--新增汽车热度窗口-->
    <el-dialog title="新增汽车热度" :visible.sync="addCarHotWindow">
      <el-form label-width="150px">
        <el-row :gutter="20" type="flex">
          <el-col :span="12">
            <el-form-item label="请选择汽车品牌:">
              <el-select v-model="brandId" placeholder="汽车品牌" clearable>
                <el-option v-for="item in carBrandList" :key="item.brandId" :label="item.brandName"
                  :value="item.brandId"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="addCarHotWindow = false">取 消</el-button>
        <el-button @click="insertCarHot">新 增</el-button>
      </div>
    </el-dialog>


    <!--汽车排量窗口-->
    <el-dialog title="汽车排量" :visible.sync="allDisplacementWindow">
      <el-row>
        <el-col :span="24">
          <el-form :inline="true">
            <el-form-item>
              <el-button type="primary" @click="showAddCarDisplacementWindow">新增汽车排量</el-button>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>

      <el-table :data="displacementWList" style="width: 100%">
        <el-table-column prop="displacementNum" label="排量" width="100" align="center"></el-table-column>
        <el-table-column label="操作" width="300" align="center">
          <template slot-scope="scope">
            <el-button type="text" @click="showUpdateCarDisplacementWindow(scope.row)">编辑</el-button>
            <el-button type="text" @click="deleteCarDisplacementById(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>

    <!--新增汽车排量窗口-->
    <el-dialog title="新增汽车排量" :visible.sync="addCarDisplacementWindow">
      <el-form label-width="150px">
        <el-row :gutter="20" type="flex">
          <el-col :span="12">
            <el-form-item label="请输入汽车排量:">
              <el-input v-model="displacementNum" placeholder="请输入汽车排量"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="addCarDisplacementWindow = false">取 消</el-button>
        <el-button @click="insertCarDisplacement">新 增</el-button>
      </div>
    </el-dialog>

    <!--修改汽车排量窗口-->
    <el-dialog title="修改汽车排量" :visible.sync="updateCarDisplacementWindow">
      <el-form :model="updateCarDisplacementForm" label-width="150px">
        <el-row :gutter="20" type="flex">
          <el-col :span="12">
            <el-form-item label="请输入汽车排量:">
              <el-input v-model="updateCarDisplacementForm.displacementNum" placeholder="请输入汽车排量"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="updateCarDisplacementWindow = false">取 消</el-button>
        <el-button @click="updateCarDisplacement">修 改</el-button>
      </div>
    </el-dialog>

  </div>
</template>

<script>
  import {
    set
  } from 'vue';
  export default {
    name: "Car",
    data() {
      return {
        headers: {},
        carBrandList: [], //汽车品牌集合
        brandIds: new Set(), // 用于存储选中的品牌ID
        addCarBrandWindow: false, // 新增品牌窗口
        addCarBrand: { // 新增汽车参数对象
          brandName: "", // 品牌名
          brandImage: "" // 品牌logo
        },
        updateCarBrandImageWindow: false, //修改图片弹窗
        updateCarBrandImageForm: { //修改图片参数对象
          brandId: "", //品牌id
          brandImage: "", //新logo
        },
        brandId: "", //品牌id,用于往后端传单参
        carSeriesWindow: false, //系列窗口
        carSeriesList: [], //汽车系列集合
        seriesIds: new Set(), // 用于存储选中的系列ID
        addCarSeriesWindow: false, //新增汽车系列窗口
        addCarSeries: {
          brandId: "", //品牌id
          seriesName: "", //系列名
        },
        seriesId: "", //车辆系列编号
        carStyleWindow: false, //汽车款式窗口
        addCarStyleWindow: false, //新增款式窗口
        addCarStyleForm: { //新增款式参数对象
          styleName: "", //styleName
          seriesId: "", //车辆系列编号
          cSId: "", //车系生产年份编号
          styleDetails: "", //styleDetails
          carPrice: "", //车辆参考价
        },
        carStyleList: [], //款式集合
        yearList: [], //年份集合
        allYearWindow: false, //年份窗口
        cSYear: "", //年份，传单参
        styleIds: new Set(), //款式id集合
        carHotWindow: false, //汽车热度榜窗口
        carHotList: [], //汽车热度榜集合
        addCarHotWindow: false, //新增汽车热度榜窗口
        allDisplacementWindow: false, //排量窗口
        displacementWList: [], //排量集合
        displacementNum: "",
        addCarDisplacementWindow: false,
        disId: "",
        updateCarDisplacementForm: {
          disId: "",
          displacementNum: "",
        },
        updateCarDisplacementWindow: false,
      }
    },
    methods: {
      updateCarDisplacement(){
        this.$http.post("/car/carDisplacement/updateCarDisplacement.api", this.updateCarDisplacementForm).then(resp => {
          if (resp.data.code == 200) {
            this.loadAllDisplacementWindow();
            this.SuccessTip(resp.data);
            this.updateCarDisplacementWindow = false
          } else {
            this.ErrorTip(resp.data)
          }
        })
      },
      showUpdateCarDisplacementWindow(row) {
        this.updateCarDisplacementForm.disId = JSON.parse(JSON.stringify(row)).disId; //获取id
        this.updateCarDisplacementWindow = true
      },
      //删除排量
      deleteCarDisplacementById(row) {
        this.disId = JSON.parse(JSON.stringify(row)).disId; //获取id
        this.$http.get("/car/carDisplacement/deleteCarDisplacement.api", {
          params:{
            disId: this.disId
          }
        }).then(resp => {
          if (resp.data.code == 200) {
            this.loadAllDisplacementWindow();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
        })
      },
      showAddCarDisplacementWindow() {
        this.addCarDisplacementWindow = true
      },
      //确认新增排量
      insertCarDisplacement() {
        this.$http.get("/car/carDisplacement/insertCarDisplacement.api", {
          params: {
            displacementNum: this.displacementNum
          }
        }).then(resp => {
          if (resp.data.code == 200) {
            this.loadAllDisplacementWindow();
            this.SuccessTip(resp.data);
             this.addCarDisplacementWindow = false
            this.displacementNum = "";
          } else {
            this.ErrorTip(resp.data)
            this.displacementNum = "";
          }
        })
      },
      //展开排量窗口
      showAllDisplacementWindow() {
        this.allDisplacementWindow = true
      },
      //查询排量
      loadAllDisplacementWindow() {
        this.$http.get("/car/carDisplacement/findAllCarDisplacement.c").then(resp => {
          if (resp.data.code == 200) {
            this.displacementWList = resp.data.data
          }
        })
      },

      //删除选中热度
      deleteCarHot() {
        this.$http.post("/car/carHot/deleteCarHot.api", this.brandIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadCarHot();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.brandIds.clear();
        })
      },
      //删除单个热度
      deleteCarHotById(row) {
        this.brandIds.add(JSON.parse(JSON.stringify(row)).brandId); //获取id
        this.$http.post("/car/carHot/deleteCarHot.api", this.brandIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadCarHot();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.brandIds.clear();
        })
      },
      //解禁选中热度
      unlockCarHot() {
        this.$http.post("/car/carHot/unlockCarHot.api", this.brandIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadCarHot();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.brandIds.clear();
        })
      },
      //禁用选中热度
      banCarHot() {
        this.$http.post("/car/carHot/banCarHot.api", this.brandIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadCarHot();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.brandIds.clear();
        })
      },
      //解锁单个热度
      unlockCarHotByid(row) {
        this.brandIds.add(JSON.parse(JSON.stringify(row)).brandId); //获取id
        this.$http.post("/car/carHot/unlockCarHot.api", this.brandIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadCarHot();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.brandIds.clear();
        })
      },
      //禁用单个热度
      banCarHotById(row) {
        this.brandIds.add(JSON.parse(JSON.stringify(row)).brandId); //获取id
        this.$http.post("/car/carHot/banCarHot.api", this.brandIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadCarHot();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.brandIds.clear();
        })
      },

      //展开在新增热度窗口
      showAddCarHotWindow() {
        this.addCarHotWindow = true
      },
      //新增热度
      insertCarHot() {
        this.$http.get("/car/carHot/insertCarHot.api", {
          params: {
            brandId: this.brandId
          }
        }).then(resp => {
          if (resp.data.code == 200) {
            this.loadCarHot()
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.addCarHotWindow = false
          this.brandId = ""
        })
      },
      //热度榜窗口
      showCarHotWindow() {
        this.carHotWindow = true
        this.loadCarHot()
      },
      //查汽车热度榜
      loadCarHot() {
        this.$http.get("/car/carHot/findAllCarHot.api").then(resp => {
          if (resp.data.code == 200) {
            this.carHotList = resp.data.data
          }
        })
      },
      //复选框取汽车款式id
      handleCarStyleChange(val) {
        this.styleIds.clear();
        val.forEach(item => {
          this.styleIds.add(item.styleId);
        });
      },
      //删除选中款式
      deleteCarStyle() {
        this.$http.post("/car/carStyle/deleteCarStyle.api", this.styleIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadAllCarStyle();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.styleIds.clear();
        })
      },
      //删除单个款式
      deleteCarStyleById(row) {
        this.styleIds.add(JSON.parse(JSON.stringify(row)).styleId); //获取id
        this.$http.post("/car/carStyle/deleteCarStyle.api", this.styleIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadAllCarStyle();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.styleIds.clear();
        })
      },
      //解禁选中款式
      unlockCarStyle() {
        this.$http.post("/car/carStyle/unlockCarStyle.api", this.styleIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadAllCarStyle();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.styleIds.clear();
        })
      },
      //禁用选中款式
      banCarStyle() {
        this.$http.post("/car/carStyle/banCarStyle.api", this.styleIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadAllCarStyle();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.styleIds.clear();
        })
      },
      //解锁单个款式
      unlockCarStyleByid(row) {
        this.styleIds.add(JSON.parse(JSON.stringify(row)).styleId); //获取id
        this.$http.post("/car/carStyle/unlockCarStyle.api", this.styleIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadAllCarStyle();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.styleIds.clear();
        })
      },
      //禁用单个款式
      banCarStyleById(row) {
        this.styleIds.add(JSON.parse(JSON.stringify(row)).styleId); //获取id
        this.$http.post("/car/carStyle/banCarStyle.api", this.styleIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadAllCarStyle();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.styleIds.clear();
        })
      },


      //查询款式
      loadAllCarStyle() {
        this.$http.get("/car/carStyle/findAllCarStyle.api", {
          params: {
            seriesId: this.seriesId
          }
        }).then(resp => {
          if (resp.data.code == 200) {
            this.carStyleList = resp.data.data
          }
        })
      },
      //展开款式窗口
      showCarStyleWindow(row) {
        this.seriesId = JSON.parse(JSON.stringify(row)).seriesId;
        this.loadAllCarStyle();
        this.carStyleWindow = true
      },
      //新增款式
      insertCarStyle() {
        this.addCarStyleForm.seriesId = this.seriesId
        this.addCarStyleForm.cSId = this.addCarStyleForm.csid
        console.log(this.seriesId)
        this.$http.post("/car/carStyle/insertCarStyle.api", this.addCarStyleForm).then(resp => {
          if (resp.data.code == 200) {
            this.loadAllCarStyle();
            this.SuccessTip(resp.data);
            this.addCarStyleWindow = false
          } else {
            this.ErrorTip(resp.data)
          }
          this.addCarStyleForm = { //新增款式参数对象
            styleName: "", //styleName
            seriesId: "", //车辆系列编号
            cSId: "", //车系生产年份编号
            styleDetails: "", //styleDetails
            carPrice: "", //车辆参考价
          }

        })
      },
      //展开新增款式窗口
      showAddCarStyleWindow() {
        this.addCarStyleWindow = true
      },
      //确认新增年份
      insertYear() {
        this.$http.get("/car/carSeriesYear/insertCarSeriesYear.api", {
          params: {
            cSYear: this.cSYear
          }
        }).then(resp => {
          if (resp.data.code == 200) {
            this.loadAllYear();
            this.SuccessTip(resp.data);
            this.cSYear = "";
          } else {
            this.ErrorTip(resp.data)
            this.cSYear = "";
          }
        })
      },
      //展开年份窗口
      showAllYearWindow() {
        this.allYearWindow = true
      },
      //查询年份
      loadAllYear() {
        this.$http.get("/car/carSeriesYear/findAllCarSeriesYear.c").then(resp => {
          if (resp.data.code == 200) {
            this.yearList = resp.data.data
          }
        })
      },
      //删除选中系列
      deleteCarSeries() {
        this.$http.post("/car/carSeries/deleteCarSeries.api", this.seriesIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadcarSeries();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.seriesIds.clear();
        })
      },
      //删除单个系列
      deleteCarSeriesById(row) {
        this.seriesIds.add(JSON.parse(JSON.stringify(row)).seriesId); //获取id
        this.$http.post("/car/carSeries/deleteCarSeries.api", this.seriesIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadcarSeries();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.seriesIds.clear();
        })
      },
      //解禁选中系列
      unlockCarSeries() {
        this.$http.post("/car/carSeries/unlockCarSeries.api", this.seriesIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadcarSeries();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.seriesIds.clear();
        })
      },
      //禁用选中系列
      banCarSeries() {
        this.$http.post("/car/carSeries/banCarSeries.api", this.seriesIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadcarSeries();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.seriesIds.clear();
        })
      },
      //解锁单个系列
      unlockCarSeriesByid(row) {
        this.seriesIds.add(JSON.parse(JSON.stringify(row)).seriesId); //获取id
        this.$http.post("/car/carSeries/unlockCarSeries.api", this.seriesIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadcarSeries();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.seriesIds.clear();
        })
      },
      //禁用单个系列
      banCarSeriesById(row) {
        this.seriesIds.add(JSON.parse(JSON.stringify(row)).seriesId); //获取id
        this.$http.post("/car/carSeries/banCarSeries.api", this.seriesIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadcarSeries();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.seriesIds.clear();
        })
      },

      //确认新增汽车系列
      insertCarSeries() {
        this.$http.post("/car/carSeries/insertCarSeries.api", this.addCarSeries).then(resp => {
          if (resp.data.code == 200) {
            this.loadcarSeries();
            this.SuccessTip(resp.data);
            this.addCarSeriesWindow = false;
            this.addCarSeries.seriesName = "";
          } else {
            this.ErrorTip(resp.data)
          }
        })
      },
      //新增汽车系列窗口
      showAddCarSeriesWindow() {
        this.addCarSeries.seriesName = "";
        this.addCarSeriesWindow = true;
        this.addCarSeries.brandId = this.brandId
      },
      //查询汽车系列
      loadcarSeries() {
        this.$http.get("/car/carSeries/findAllSeriesByBrandId.api", {
          params: {
            brandId: this.brandId
          }
        }).then(resp => {
          if (resp.data.code == 200) {
            this.carSeriesList = resp.data.data
          }
        })
      },
      //复选框取汽车系列id
      handleCarSeriesChange(val) {
        this.seriesIds.clear();
        val.forEach(item => {
          this.seriesIds.add(item.brandId);
        });
      },
      //系列窗口
      showCarSeriesWindow(row) {
        this.brandId = JSON.parse(JSON.stringify(row)).brandId; //获取id
        this.loadcarSeries();
        this.carSeriesWindow = true
      },
      //修改汽车品牌logo
      updateCarBrandImage() {
        this.$refs.upload.submit();
      },
      //修改汽车品牌logo成功后的回调
      updateCarBrandImageSuccess(response) {
        if (response.code == "200") {
          this.updateCarBrandImageWindow = false; // 关闭修改汽车品牌logo对话框
          this.SuccessTip(response); // 提示新增成功信息
          this.loadCarBrand(); // 刷新页面
          // 清空上传文件列表
          this.$refs.upload.clearFiles();
        } else {
          this.ErrorTip(response); // 提示新增失败信息
        }
      },

      // 修改汽车品牌logo失败后的回调
      updateCarBrandImageError(response) {
        this.ErrorTip(response);
      },
      //修改图片弹窗
      showUpdateCarBrandImageWindow(row) {
        this.updateCarBrandImageForm.brandId = JSON.parse(JSON.stringify(row)).brandId; //获取id
        this.updateCarBrandImageWindow = true
      },
      //删除选中品牌
      deleteCarBrand() {
        this.$http.post("/car/carBrand/deleteCarBrand.api", this.brandIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadCarBrand();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.brandIds.clear();
        })
      },
      //删除单个品牌
      deleteCarBrandById(row) {
        this.brandIds.add(JSON.parse(JSON.stringify(row)).brandId); //获取id
        this.$http.post("/car/carBrand/deleteCarBrand.api", this.brandIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadCarBrand();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.brandIds.clear();
        })
      },
      //解禁选中品牌
      unlockCarBrand() {
        this.$http.post("/car/carBrand/unlockCarBrand.api", this.brandIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadCarBrand();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.brandIds.clear();
        })
      },
      //禁用选中品牌
      banCarBrand() {
        this.$http.post("/car/carBrand/banCarBrand.api", this.brandIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadCarBrand();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.brandIds.clear();
        })
      },
      //解锁单个品牌
      unlockCarBrandByid(row) {
        this.brandIds.add(JSON.parse(JSON.stringify(row)).brandId); //获取id
        this.$http.post("/car/carBrand/unlockCarBrand.api", this.brandIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadCarBrand();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.brandIds.clear();
        })
      },
      //禁用单个品牌
      banCarBrandById(row) {
        this.brandIds.add(JSON.parse(JSON.stringify(row)).brandId); //获取id
        this.$http.post("/car/carBrand/banCarBrand.api", this.brandIds).then(resp => {
          if (resp.data.code == 200) {
            this.loadCarBrand();
            this.SuccessTip(resp.data);
          } else {
            this.ErrorTip(resp.data)
          }
          this.brandIds.clear();
        })
      },
      //状态展示
      getStateText(state) {
        switch (state) {
          case 0:
            return '正常';
          case 1:
            return '禁用';
          case 2:
            return '删除';
          default:
            return '未知状态';
        }
      },
      //展开新增汽车品牌窗口
      showAddCarBrandWindow() {
        this.addCarBrandWindow = true
      },
      //复选框取汽车品牌id
      handleSelectionChange(val) {
        this.brandIds.clear();
        val.forEach(item => {
          this.brandIds.add(item.brandId);
        });
      },
      //查询汽车品牌
      loadCarBrand() {
        this.$http.get("/car/carBrand/findAllCarBrand.api").then(resp => {
          if (resp.data.code == 200) {
            this.carBrandList = resp.data.data
          }
        })
      },
      //新增汽车品牌
      insertCarBrand() {
        this.$refs.upload.submit();
      },
      // 新增汽车品牌成功后的回调
      addCarBrandSuccess(response) {
        if (response.code == "200") {
          this.addCarBrandWindow = false; // 关闭新增汽车品牌对话框
          this.SuccessTip(response); // 提示新增成功信息
          this.loadCarBrand(); // 刷新页面
          // 清空上传文件列表
          this.$refs.upload.clearFiles();
        } else {
          this.ErrorTip(response); // 提示新增失败信息
        }
      },

      // 新增汽车品牌失败后的回调
      addCarBrandError(response) {
        this.ErrorTip(response);
      },
      SuccessTip(data) { //成功
        if (data.code === 200) {
          // 如果code为200，则弹出绿色的提示框
          this.$message({
            message: data.msg,
            type: 'success'
          });
        }
      },
      ErrorTip(data) { //失败
        if (data.code !== 200) {
          // 如果code为200，则弹出绿色的提示框
          this.$message({
            message: data.msg,
            type: 'error'
          });
        }
      },

    },
    created() {
      this.loadCarBrand();
      this.loadAllYear();
       this.loadAllDisplacementWindow();
      this.headers["token"] = localStorage.getItem("token");
    }
  }
</script>

<style>
</style>
